import React, { Component } from 'react';
import {
  StyleSheet,
  Text,
  View,
  ScrollView,
  ListView,
  Image,
  TextInput,
  TouchableOpacity,
  Platform,
  Picker,
  InteractionManager,
  DeviceEventEmitter,
  ActivityIndicator,
  Dimensions,
  Linking,
  NativeAppEventEmitter
} from 'react-native';

import * as config from '../../constants/apiConfig';
import styles from './orderAppealStyle';
import moment from 'moment';
import api from '../../services/api';
import Toast from 'react-native-sk-toast';

import KeyboardAwareScrollView from '../global/keyboardScrollView/KeyboardAwareScrollView';
import Touch from '../global/Touch';

const Screen = Dimensions.get('window');

class OrderAppeal extends Component {
    constructor(props) {
		super(props);

        this.state = {
            loadingShow: false,
            appeal_ing: props.appealStatus == 1?true:false,
		};

		// this.props.navigator.setOnNavigatorEvent(this._onNavigatorEvent.bind(this));
	}

    componentDidMount(){
        // let { session } = this.props;
        // if( session ) {
        //     this.setState({
        //         keeper_head: session.user.keeper_head
        //     });
        // }
        // InteractionManager.runAfterInteractions(() => {
        //     this._actionAppeal(1);
        // });

    }

    async _ok(){
        let {orderId} = this.props;
        this.setState({
            loadingShow: true
        });

        let res = await api.post("/order/appeal",{orderId: orderId, appealStatus: 1});

        if(res.cd == 0){
            this.setState({
                loadingShow: false,
                appeal_ing: true,
            });
            this.props.navigator.setTitle({
                title: "申诉中"
            });
            
            Toast.bottom('申请提交成功');
        }else{
            this.setState({
                loadingShow: false
            });
            Toast.bottom('申诉提交失败，请重试');
        }
    }

    _cancel(){
        this.props.navigator.pop();
    }

    _openEmail(){
        Linking.canOpenURL("mailto:hcwy_gjzx@hechangre.com").then(supported => {
              if (!supported) {
                console.log('Can\'t handle url: mailto:hcwy_gjzx@hechangre.com');
              } else {
                return Linking.openURL("mailto:hcwy_gjzx@hechangre.com");
              }
        }).catch(err => console.error('An error occurred', err));
    }

    _renderStatus(){
        let {appealStatus} = this.props;
        if(appealStatus == 0 || appealStatus == 1){
            return (
                <View style={styles.formContainer}>
                    {this.state.appeal_ing?
                    <View style={styles.topContainer}>
                        <Image source={require('../../../img/ing_appeal_icon.png')} style={[styles.titleImage,{width:50,height:60}]}/>
                        <View style={styles.listContainer}>
                            <Text style={styles.text}>您已经向后台客服提出申诉</Text>
                            <Text style={styles.text}>我们会尽快为您处理</Text>
                            <Text style={styles.text}>请耐心等候～</Text>
                        </View>
                    </View>:
                    <View style={styles.topContainer}>
                        <Image source={require('../../../img/not_appeal_icon.png')} style={styles.titleImage}/>
                        <View style={styles.listContainer}>
                            <Text style={styles.text}>当前系统不能更改评价内容</Text>
                            <Text style={styles.text}>若该评价含有粗俗言语</Text>
                            <Text style={styles.text}>请您点击 <Text style={styles.textSpi}>我要申诉</Text></Text>
                            <Text style={styles.text}>后台会尽快为您处理</Text>
                        </View>
                    </View>}

                    <View style={[styles.btnContainer,this.state.appeal_ing?{marginTop: 50}:{}]}>
                        {this.state.appeal_ing?
                        null:
                        <Touch style={styles.appealBtnOk} activeOpacity={0.7} onPress={this._ok.bind(this)}>
                            <Text style={styles.appealBtn}>我要申诉</Text>
                        </Touch>}
                        <Touch style={styles.appealBtnCancel} activeOpacity={0.7} onPress={this._cancel.bind(this)}>
                            <Text style={[styles.appealBtn,{color: '#fff'}]}>我知道了</Text>
                        </Touch>
                    </View>
                </View>
            );
        }else if(appealStatus == 2){
            return (
                <View style={styles.formContainer}>
                    <View style={styles.topContainer}>
                        <Image source={require('../../../img/suc_appeal_icon.png')} style={[styles.titleImage,{width:60,height:60}]}/>
                        <View style={styles.listContainer}>
                            <Text style={styles.text}>您好，您的申诉已经处理完成</Text>
                            <Text style={styles.text}>给您带来的问题深表歉意。</Text>
                        </View>
                    </View>
                    <View style={[styles.btnContainer,{marginTop:60}]}>
                        <Touch style={styles.appealBtnCancel} activeOpacity={0.7} onPress={this._cancel.bind(this)}>
                            <Text style={[styles.appealBtn,{color: '#fff'}]}>我知道了</Text>
                        </Touch>
                    </View>
                </View>
            );
        }else if(appealStatus == 3){
            return (
                <View style={styles.formContainer}>
                    <View style={styles.topContainer}>
                        <Image source={require('../../../img/fail_appeal_icon.png')} style={[styles.titleImage,{width:60,height:60}]}/>
                        <View style={styles.listContainer}>
                            <Text style={styles.text}>您好，很抱歉</Text>
                            <Text style={styles.text}>您的申诉未能通过后台核实</Text>
                            <Text style={styles.text}>如有疑问，请发送邮件到管家中心</Text>
                            <Touch activeOpacity={0.7} onPress={this._openEmail.bind(this)}>
                                <Text style={[styles.text, {color: '#5DBAFD'}]}>hcwy_gjzx@hechangre.com</Text>
                            </Touch>
                        </View>
                    </View>
                    <View style={[styles.btnContainer,{marginTop: 25}]}>
                        <Touch style={styles.appealBtnCancel} activeOpacity={0.7} onPress={this._cancel.bind(this)}>
                            <Text style={[styles.appealBtn,{color: '#fff'}]}>我知道了</Text>
                        </Touch>
                    </View>
                </View>
            );
        }
    }

    render() {

        return (
            <View style={[styles.wrapper,{backgroundColor:'#f3f3f3'}]}>
                <KeyboardAwareScrollView style={styles.container} extraScrollHeight={60}>
                    {this._renderStatus()}
                </KeyboardAwareScrollView>
                {this.state.loadingShow?
                <View style={[styles.loadContainer, {bottom:(Screen.height - 60) / 2}]}>
                    <ActivityIndicator size="small" color={Platform.OS === "ios" ? "#f3f3f3" : "#EA0000"} />
                </View>:null}
            </View>
        );
    }
}

var connectHelper = require('../../services/connectHelper');
OrderAppeal = connectHelper(state => state)(OrderAppeal);

module.exports = OrderAppeal;
